/*
 * table style
 */
.table {
	width: 100%;
	margin-bottom: @baseLineHeight;

	// 对齐是排版最重要的因素, 别让什么都居中
	caption,th,td {
		text-align:left;
	}
	caption, th{
		font-weight: 600;
 	}
	caption {
		padding: @tablePadding;
		font-size: @tableCaptionFontSize;
	}
	// Cells
	th,td {
		padding: @tablePadding;
		line-height: @baseLineHeight;
		vertical-align: middle;
		border-top: 1px solid @tableBorder;
	}
}

// CONDENSED TABLE W/ HALF PADDING
// -------------------------------
.table-condensed {
	th, td {
		padding: @tablePadding/2;
	}
}

// BORDERED
// ----------------
.table-bordered {
	border: 1px solid @tableBorder;
	border-left: 0;

	th, td {
		border-left: 1px solid @tableBorder;
	}
}

// TABLE BACKGROUNDS
// -----------------
// Exact selectors below required to override .table-striped
.table tbody tr {
	&.success td {
		background-color: @successBackground;
	}
	&.error td {
		background-color: @errorBackground;
	}
	&.warn td {
		background-color: @warnBackground;
	}
	&.info td {
		background-color: @infoBackground;
 	}
}
// TODO gird
/*
 * table style for high version browser
 */
.table{
  tr.first-child td, tr.first-child th, thead th {
    border-top: 0;
  }
}
// ZEBRA-STRIPING
// --------------
// Default zebra-stripe styles (alternating gray and transparent backgrounds)
.table-striped {
  tbody {
    tr:nth-child(odd) td, tr:nth-child(odd) th {
      background-color: @tableBackgroundAccent;
    }
  }
}

// HOVER EFFECT
// ------------
// Placed here since it has to come after the potential zebra striping
.table-hover {
  tbody {
    tr:hover td, tr:hover th {
      background-color: @tableBackgroundHover;
    }
  }
}

// TABLE BACKGROUNDS
// -----------------
// Hover states for .table-hover
.table-hover tbody tr {
  &.success:hover td {
    background-color: darken(@successBackground, 5%);
  }
  &.error:hover td {
    background-color: darken(@errorBackground, 5%);
  }
  &.warn:hover td {
    background-color: darken(@warnBackground, 5%);
  }
  &.info:hover td {
    background-color: darken(@infoBackground, 5%);
  }
}